<%@ page contentType="text/html;charset=UTF-8"%>
<%@ page import="org.apache.shiro.web.filter.authc.FormAuthenticationFilter"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>

<!DOCTYPE html>
<html>
<head>
<script src="${ctxStatic}/jquery/jquery-1.9.1.min.js" type="text/javascript"></script>
<link rel="Stylesheet" href="${ctxStatic}/bootstrap/2.3.1/css_cerulean/bootstrap.min.css" />
<link href="${ctxStatic}/jquery-validation/1.11.0/jquery.validate.min.css" type="text/css"
	rel="stylesheet" />
<script src="${ctxStatic}/jquery-validation/1.11.0/jquery.validate.min.js" type="text/javascript"></script>

<link rel="stylesheet" href="${ctxStatic}/jquery-select2/3.4/select2.min.css">
<script type="text/javascript" src="${ctxStatic}/jquery-select2/3.4/select2.min.js"></script>

<script src="${ctxStatic}/common/json2.js" type="text/javascript"></script>

<script type="text/javascript">

	$(document).ready(function() {
		$("#loginForm").validate({
			rules: {
				validateCode: {remote: "/timesexpense/servlet/validateCodeServlet"}
			},
			messages: {
				username: {required: "请填写用户名."},password: {required: "请填写密码."},
				accountId: {required: "请选择账套."},
				validateCode: {remote: "验证码不正确.", required: "请填写验证码."}
			},
			errorLabelContainer: "#messageBox",
			errorPlacement: function(error, element) {
				error.appendTo($("#loginError").parent());
			} 
		});
	});
	

	 $(document).ready(function () {
		 $("#accountId").select2({
			    data:[]
		});
	　});
	 
	
	 function usernameOrpasswordOnchange(){
		 
		  var username = $("#username").val();
		  var password = $("#password").val();
		  
		  if(username =='' || password ==''){
			  return;
		  }
		  
		 
		  $.getJSON("${ctx}/acc/accAccount/findAccountByLoginName?loginName="+username+"&password="+password,function(data){
				 
			  if(data == null){
				  $("#accountId").select2({
					    placeholder:"请选择账套",
					    data:[]
				}); 
			  }else{
				  //indexOf兼容性
				  if (!Array.prototype.indexOf)
				  {
				    Array.prototype.indexOf = function(elt /*, from*/)
				    {
				      var len = this.length >>> 0;
				      var from = Number(arguments[1]) || 0;
				      from = (from < 0)
				           ? Math.ceil(from)
				           : Math.floor(from);
				      if (from < 0)
				        from += len;
				      for (; from < len; from++)
				      {
				        if (from in this &&
				            this[from] === elt)
				          return from;
				      }
				      return -1;
				    };
				  };
				  
				  if(data.indexOf("用户名或者密码错误，找不到对应账套") >-1){
					  alert("用户名或者密码错误，找不到对应账套");
					  return;
				  }
				  
				  $("#accountId").select2({
					    data:data
				}); 
			    $(".select2-chosen").css("color","#555555");
			  }

		  });
		 
	 }
	 

</script>
<title>时代地产物业系统 登录</title>
<link rel="stylesheet" href="${ctxStatic}/css/login.css">
<style type="text/css">
/* 重写select2 样式  add for lgx 20161025 */
.select2-container .select2-choice {
  height: 40px;
  border-top-color:#dadada;
  border-bottom-color: #dadada;
  border-right-color: #dadada;
  border-right-color: #dadada; 
  border-left-color: #dadada;
}

.select2-container .select2-choice .select2-arrow{
  border-left-color: #dadada;
}

.select2-container .select2-choice .select2-arrow b {
  background-position-y: 6px;
}
.select2-chosen{
  font-size: 14px;
/*   height: 42px; */
/*   margin-top:10px; */
	line-height: 40px;	
  font-weight:normal; 
  color: #dadada;
}

.select2-drop-active{
  border-bottom-color: #dadada;
  border-right-color: #dadada;
  border-right-color: #dadada; 
  border-left-color: #dadada;
}
</style>
</head>

<body>
	<div class="login">
		<form id="loginForm" class="form-signin" action="${ctx}/login" method="post">
			<div class="img">
				<img src="${ctxStatic}/imgs/loginLogo.png">
			</div>
			<div class="login-input clearfix">
				<label for="username" class="userIcon">
				</label><input type="text" onchange="usernameOrpasswordOnchange();" id="username" name="username"
					class="login-name required" placeholder="用户名" autofocus>
			</div>
			<div class="login-input clearfix">
				<label for="username" class="pwIcon">
				</label><input type="password" id="password" name="password" onchange="usernameOrpasswordOnchange();" class="login-lock required"
					placeholder="密码">
			</div>
			<div class="login-input clearfix">
				<input type="text" id="accountId" name="accountId" style="width: 358px; height: 42px" placeholder="请选择账套"
					class="required" />
			</div>
			<c:if test="${isValidateCodeLogin}">
				<div class="validateCode">
					<sys:validateCode name="validateCode" />
				</div>
			</c:if>
			<input type="submit" value="登录" class="login-submit">
			<div id="messageBox" class="${empty message ? 'hide' : ''}">
				<p>
					<label id="loginError" class="error">${message}</label>
				</p>
			</div>

			
		</form>
	</div>

</body>
</html>
